<template>
  <div>
    <h1>sdgdfh</h1>
    <t-ag-grid
      style="width: 100%; height: 500px"
      :column-defs="column"
      :row-data="tableData"
      :row-buffer="20"
      row-selection="multiple"
      :suppress-row-click-selection="true"
      :row-multi-select-with-click="true"
      align="center"
      :stripe="false"
      header-align="center"
      />
  </div>
</template>

<script setup lang="ts">

  const column = [
    { headerName: "Make", field: "make" },
    { headerName: "Model", field: "model" },
    { headerName: "Price", field: "price" }
  ]

  const tableData = [
    { make: "Toyota", model: "Celica", price: 35000 },
    { make: "Ford", model: "Mondeo", price: 32000 },
    { make: "Porsche", model: "Boxster", price: 72000 }
  ]
</script>